{extend name="common/base" /}
<!--title-->
{block name="titlekeyword"}
<title>{$content}</title>

{/block}
<!--代码主要内容-->
{block name="main"}
<h6>内容</h6>
<input type="checkbox" name="fruit" onclick="gouwu(this)" value="10" />苹果 10元
<br/>
<input type="checkbox" name="fruit" onclick="gouwu(this)" value="20" />香蕉 20元
<br/>
<input type="checkbox" name="fruit" onclick="gouwu(this)" value="30" />鸭梨 30元
<br/>
<input type="checkbox" name="fruit" onclick="gouwu(this)" value="40" />西瓜 40元
<br/>
<input type="checkbox" name="fruit" onclick="gouwu(this)" value="50" />哈密瓜 50元
<br/> 总价格是：
<span id="myspan">0元</span>
<h6>代码</h6>
<pre>
		页面

		&lt;input type="checkbox" name="fruit" onclick="gouwu(this)" value="10" /&gt;苹果 10元
		&lt;br/&gt;
		&lt;input type="checkbox" name="fruit" onclick="gouwu(this)" value="20" /&gt;香蕉 20元
		&lt;br/&gt;
		&lt;input type="checkbox" name="fruit" onclick="gouwu(this)" value="30" /&gt;鸭梨 30元
		&lt;br/&gt;
		&lt;input type="checkbox" name="fruit" onclick="gouwu(this)" value="40" /&gt;西瓜 40元
		&lt;br/&gt;
		&lt;input type="checkbox" name="fruit" onclick="gouwu(this)" value="50" /&gt;哈密瓜 50元
		&lt;br/&gt; 总价格是：
		&lt;span id="myspan"&gt;0元&lt;/span&gt;
		
		js
		
		&lt;script language="javascript"&gt;
			function gouwu(obj) {
				var fruits = document.getElementsByName("fruit");
				var totalPrice = 0;
				//遍历所有的checkbox，计算新的总价
				for (var i = 0; i &lt; fruits.length; i++) {
					if (fruits[i].checked) {
						totalPrice += parseFloat(fruits[i].value);
					}
				}
				myspan.innerText = totalPrice + "元";
			}
		&lt;/script&gt;

	 </pre> {/block}
<!--底部js 在这里是js的实际代码区-->
{block name="footjs"}
<script language="javascript">
	function gouwu(obj) {
		var fruits = document.getElementsByName("fruit");
		var totalPrice = 0;
		//遍历所有的checkbox，计算新的总价
		for (var i = 0; i < fruits.length; i++) {
			if (fruits[i].checked) {
				totalPrice += parseFloat(fruits[i].value);
			}
		}
		myspan.innerText = totalPrice + "元";
	}
</script> {/block}